<ui:composition 
	xmlns="http://www.w3.org/1999/xhtml" 
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets" 
	template="/template/main.xhtml">

	<ui:define name="body">
	
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
	
		<h:form prependId="false">
			<p:toolbar>
				<p:toolbarGroup align="left">
					<h:commandButton value="#{messages['button.save']}" action="#{enderecoEditMB.insert}"
						rendered="#{!enderecoEditMB.updateMode}" ajax="false" />
					<h:commandButton value="#{messages['button.save']}" action="#{enderecoEditMB.update}"
						rendered="#{enderecoEditMB.updateMode}"/>
					<p:commandButton value="#{messages['button.delete']}" onclick="confirmation.show()"
						rendered="#{enderecoEditMB.updateMode}" type="button" immediate="true" ajax="false" />
					<p:confirmDialog message="#{messages['label.confirm.delete']}" showEffect="bounce" hideEffect="explode"
						header="#{messages['label.dialog.delete']}" severity="alert" widgetVar="confirmation">
						<h:commandButton value="#{messages['button.dialog.yes']}" action="#{enderecoEditMB.delete}" immediate="true" ajax="false" />
						<h:commandButton value="#{messages['button.dialog.no']}" onclick="confirmation.hide()" type="button" />
					</p:confirmDialog>
				</p:toolbarGroup>
			</p:toolbar>

			<br />

			<p:fieldset id="filedSet_endereco" legend="#{messages['endereco.label']}" toggleable="true" toggleSpeed="500">
				<table style="width: 100%">
					<tr>
						<td>
							<p:panelGrid id="fields" columns="3">
								<h:outputLabel value="#{messages['endereco.label.id']}: " for="id"/>
								<p:inputText id="id" value="#{enderecoEditMB.bean.id}" disabled="true"/>
								<p:message for="id" />
								
								<h:outputLabel value="#{messages['endereco.label.cep']}: " for="cep" />
								<h:inputText id="cep" value="#{enderecoEditMB.bean.cep}" title="#{messages['endereco.alt.cep']}" />
								<p:message for="cep" />
								
								<h:outputLabel value="#{messages['endereco.label.logradouro']}: " for="logradouro" />
								<h:inputTextarea id="logradouro" value="#{enderecoEditMB.bean.logradouro}" title="#{messages['endereco.alt.logradouro']}" rows="2" cols="50"/>
								<p:message for="logradouro" />
								
								<h:outputLabel value="#{messages['endereco.label.numero']}: " for="numero" />
								<h:inputText id="numero" value="#{enderecoEditMB.bean.numero}" title="#{messages['endereco.alt.numero']}" />
								<p:message for="numero" />
								
								<h:outputLabel value="#{messages['endereco.label.bairro']}: " for="bairro" />
								<h:inputText id="bairro" value="#{enderecoEditMB.bean.bairro}" title="#{messages['endereco.alt.bairro']}" />
								<p:message for="bairro" />
								
								<h:outputLabel value="#{messages['endereco.label.complemento']}: " for="complemento" />
								<h:inputText id="complemento" value="#{enderecoEditMB.bean.complemento}" title="#{messages['endereco.alt.complemento']}" />
								<p:message for="complemento" />
								
								<h:outputLabel value="#{messages['endereco.label.localidade']}: " for="localidade" />
								<h:inputText id="localidade" value="#{enderecoEditMB.bean.localidade}" title="#{messages['endereco.alt.localidade']}" />
								<p:message for="localidade" />
								
								<h:outputLabel value="#{messages['endereco.label.uf']}: " for="uf" />
								<h:inputText id="uf" value="#{enderecoEditMB.bean.uf}" title="#{messages['endereco.alt.uf']}" />
								<p:message for="uf" />
								
								<h:outputLabel value="#{messages['endereco.label.situacao']}: " for="situacao" />
								<h:inputText id="situacao" value="#{enderecoEditMB.bean.situacao}" title="#{messages['endereco.alt.situacao']}" />
								<p:message for="situacao" />
								
								<h:outputText value=""/>
								<h:commandButton value="buscarPontosXY" action="#{enderecoEditMB.buscarEnderecoGMapByEndereco}" update="filedSet_endereco"/>
								<h:outputText value=""/>
								
								<h:outputLabel value="#{messages['endereco.label.pontox']}: " for="pontoX" />
								<h:inputText id="pontoX" value="#{enderecoEditMB.bean.pontoX}" title="#{messages['endereco.alt.pontox']}" />
								<p:message for="pontoX" />
								
								<h:outputLabel value="#{messages['endereco.label.pontoy']}: " for="pontoY" />
								<h:inputText id="pontoY" value="#{enderecoEditMB.bean.pontoY}" title="#{messages['endereco.alt.pontoy']}" />
								<p:message for="pontoY" />
							</p:panelGrid>
						</td>

						<td>
							<p:gmap id="gmapEndereco" center="#{enderecoEditMB.bean.pontoX} , #{enderecoEditMB.bean.pontoY}" draggable="true"
									zoom="18" type="HYBRID" style="width:600px;height:400px" >
							</p:gmap>
						</td>
						
					</tr>
				</table>

			</p:fieldset>

		</h:form>
	</ui:define>
</ui:composition>


<!-- 
								<p:ajax event="markerDrag" listener="#{enderecoEditMB.onMarkerDrag}" update="pontoX,pontoY"/>
 -->